@charset "utf-8";
@font-face {
    font-family: 'NotoSansKR-Bold';
    src: url('./assets/fonts/NotoSansKR-Bold.otf'),url('./assets/fonts/NotoSansKR-Bold.woff') format('woff'),url('./assets/fonts/NotoSansKR-Bold.woff2') format('woff2');
}
@font-face {
    font-family: 'NotoSansKR-Light';
    src: url('./assets/fonts/NotoSansKR-Light.otf'),url('./assets/fonts/NotoSansKR-Light.woff') format('woff'),url('./assets/fonts/NotoSansKR-Light.woff2') format('woff2');
}
@font-face {
    font-family: 'NotoSansKR-Medium';
    src: url('./assets/fonts/NotoSansKR-Medium.otf'),url('./assets/fonts/NotoSansKR-Medium.woff') format('woff'),url('./assets/fonts/NotoSansKR-Medium.woff2') format('woff2');
}
@font-face {
    font-family: 'NotoSansKR-Regular';
    src: url('./assets/fonts/NotoSansKR-Regular.otf'),url('./assets/fonts/NotoSansKR-Regular.woff') format('woff'),url('./assets/fonts/NotoSansKR-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'FreeSans';
    src: url('./assets/fonts/FreeSans.ttf')
}
@font-face {
    font-family: 'FreeSans-Bold';
    src: url('./assets/fonts/FreeSans-Bold.ttf')
}
@font-face {
    font-family: 'HGGGothicssi-00g';
    src: url('./assets/fonts/HGGGothicssi-00g.ttf')
}
@font-face {
    font-family: 'HGGGothicssi-20g';
    src: url('./assets/fonts/HGGGothicssi-20g.ttf')
}
@font-face {
    font-family: 'HGGGothicssi-40g';
    src: url('./assets/fonts/HGGGothicssi-40g.ttf')
}
@font-face {
    font-family: 'HGGGothicssi-60g';
    src: url('./assets/fonts/HGGGothicssi-60g.ttf')
}
@font-face {
    font-family: 'HGGGothicssi-80g';
    src: url('./assets/fonts/HGGGothicssi-80g.ttf')
}
/* reset & common class */
*{-webkit-tap-highlight-color:transparent}
html {color:#000;background:#fff;font-family: 'NotoSansKR-Regular', 'Nanum Gothic', 'dotum', Helvetica, Arial, sans-serif;font-size: 14px;}
html,
body {width:100%;-webkit-text-size-adjust:none;scroll-behavior:smooth;}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
button {margin:0;padding:0;}
table {border-spacing:0;border-collapse:collapse;font-size:inherit;line-height:100%}
fieldset,
img {border:0}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {font-weight:normal;font-style:normal}
strong,
b {font-weight:normal}
ol,
ul,
li {list-style:none}
caption,
th {text-align:left}
h1,
h2,
h3,
h4,
h5,
h6 {font-size:100%;font-weight:normal}
a {color:inherit;text-decoration:none}
header,
footer,
section,
nav,
article {display:block}
input,
button,
textarea,
select,
optgroup,
option {font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit}
input,
button,
textarea,
select {line-height:normal}
button {border:0;background:transparent;cursor:pointer}
.hidden,
.blind {overflow:hidden;clip:rect(1px,1px,1px,1px);position:absolute !important;width:1px;height:1px}
.ellipsis {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.noSelect {-webkit-user-select:none;-moz-user-select:none;user-select:none}
input[type=text]::-ms-clear {display:none}
a{transition: all .3s;text-decoration:none;color: #000;}
a:focus{outline: none;}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #929292 !important;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder{color: #929292 !important;}
input::-moz-placeholder, textarea::-moz-placeholder{color: #929292 !important;}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; }
input[type="number"]{ -moz-appearance: textfield; }

::-webkit-scrollbar-track-piece{background: transparent;}
::-webkit-scrollbar{width: 6px;height: 6px;}
::-webkit-scrollbar-thumb{background: #E0E0E0;border-radius: 6px;height: 6px;}

// img[lazy=loading] {
//     width: 40px!important;
//     margin: 24% auto;
// }
img[lazy=loaded]{ animation:fade .5s; } 
@keyframes fade { 0%{opacity: 0;} 100%{opacity: 1;} } 
.slide-fade-enter-active { transition: all .3s ease; } 
.slide-fade-leave-active { opacity: 1; } 
.slide-fade-enter, .slide-fade-leave-to { opacity: 0; transition: all .3s ease; }

.red{color: #fe2e2e !important;}
.orange{color: #ff8c1c !important;}
.green{color: #00ae39 !important;}
.blue{color: #2e2efe !important;}

body{
    padding-top: 110px;
}
header{
    box-sizing: border-box;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100;    
    padding: 30px 60px;
    height: 110px;
    transition: all .3s;
    &.sticky{
        background: #fff;
        box-shadow: 0 3px 15px rgba(0,0,0,0.05);
    }
    .logo{
        float: left;   
        margin-right: 90px;     
        img{
            transition: all .3s;
            display: block;
            height: 60px;
        }
    }
    ul{        
        li{
            position: relative;
            overflow: hidden;
            &.ico_service{
                background: url(./assets/images/ico_ser.png) center no-repeat;
                background-size: auto 100%;
            }
            &:hover{
                overflow: visible;
                dl{
                    opacity: 1;
                    transform: translate(-50%,0);
                }
                .btn{
                    background:#2e2efe;
                    color: #fff !important;
                }
            }
            dl{
                opacity: 0;
                position: absolute;
                transition: all .3s;
                z-index: 5;
                left: 50%;
                transform: translate(-50%,10%);
                top: 65px;
                padding: 20px 25px;
                border: 1px solid #2e2efe;
                background: #fff;
                dd{
                    a{
                        font-size: 20px;
                        font-family: 'NotoSansKR-Medium';
                        white-space:nowrap;
                        line-height: 45px;
                        transition: all .3s;
                        cursor: pointer;
                        &:hover{
                            font-weight: bold;
                            color: #2e2efe;
                        }  
                    }                    
                }
                &::after{
                    content: '';
                    width: 70%;
                    height: 10px;
                    position: absolute;
                    left: 50%;
                    top: -10px;
                    transform: translateX(-50%);
                    background: #2e2efe;
                }
                &::before{
                    content: '';
                    width: 70%;
                    height: 20px;
                    position: absolute;
                    left: 50%;
                    top: -20px;
                    transform: translateX(-50%);
                }
            }
        }
    }
    .nav{
        float: left;
        li{
            float: left;
            margin-right: 120px;
            a.m{
                display: block;
                line-height: 60px;
                font-size: 28px;
                font-family: 'NotoSansKR-Bold';
                &:hover{
                    color: #2e2efe;                    
                }
            }
        }
    }
    .fr{
        float: right;
        padding: 15px 0;
        ul{
            li{
                float: left;
                line-height: 30px;
                .ico_service,.ico_user{
                    display: block;
                    padding: 15px 40px;
                }
                .ico_user{
                    background: url(./assets/images/ico_user.png) center no-repeat;
                    background-size: auto 90%;
                }
                &.line{
                    width: 20px;
                    height: 30px;
                    position: relative;
                    &::after{
                        content: '';
                        width: 1px;
                        height: 70%;
                        background: #000;
                        position: absolute;
                        left: 50%;
                        top: 50%;
                        transform: translate(-50%,-50%);
                    }
                }
                .btn{
                    display: inline-block;
                    padding: 0 25px;
                    color: #2e2efe;
                    font-family: 'NotoSansKR-Medium';
                }
                dl{
                    top: 45px;
                    &::after{
                        width: 50%;
                    }
                }
            }
        }
    }
    .wap{
        display: none;
        .navBtn{
            position: absolute;
            top: 50%;
            left: 0;
            transform: translateY(-50%);
            pointer-events: auto;
            height: 20px;
            padding: 10px 15px;
            display: block;
            .icon {
                position: relative;
                top: 10px;
                height: 2px;
                width: 26px;
                z-index: 20;
                transition: all .16s ease-out;
                &::before,&::after {
                    content: '';
                    position: absolute;                
                    left: 0;
                    height: 2px;
                    width: 26px;
                    background-color: #161616;
                    transition: all .16s ease-out;
                }
                &::before{
                    bottom: 8px;
                }
                &::after {
                    top: 8px;
                }
                .line {
                    position: absolute;
                    height: 2px;
                    width: 26px;
                    background-color: #161616;
                    transition: all .16s ease-out;
                }
                &.exit{
                    .line{opacity: 0;}                
                    &::before {
                        transform: rotateZ(45deg);
                        bottom: 0;
                    }    
                    &::after {
                        transform: rotateZ(-45deg);
                        top: 0;
                    }
                }
            }
        }
        &.open{
            .navBox{
                transform: translateX(0);
            }
        }
        .mask,.mask2{
            position: fixed;
            z-index: 4;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.2);
        }
        .mask2{
            z-index: 2;
            background: none;
        }
        .navBox{
            position: absolute;
            z-index: 5;
            left: 0;
            top: 0;
            height: 100vh;
            transition: transform .4s cubic-bezier(.645,.045,.355,1);
            width: 60%;
            transform: translateX(-110%);
            background: #fff;
            padding: 40px 30px;
            ul{
                li{
                    width: 100%;
                    padding: 10px 0;
                    .parent{
                        position: relative;
                        padding-bottom: 10px;
                        border-bottom: 1px solid #eee;
                        .m{
                            font-size: 18px;
                            font-family: "NotoSansKR-Bold";
                        }
                        .arrow{
                            position: absolute;
                            right: 0;
                            top: 0;
                            width: 30%;
                            text-align: right;
                            font-size: 18px;
                            i{
                                transition: all .3s;
                            }
                            &.open{
                                i{
                                    transform: rotate(-180deg);
                                }
                            }
                        }
                    }                
                    .sub{
                        padding: 10px 0 0 0;
                        .item{
                            line-height: 30px;
                        }
                    }
                    .router-link-exact-active{
                        color: #2e2efe;
                    }
                }
            }
        }
        .userBox{
            position: absolute;
            z-index: 3;
            right: 10px;
            top: 15px;
            ul{
                li{
                    float: left;
                    position: relative;
                    overflow: visible;
                    .parent{
                        a{
                            padding: 0 5px;
                            line-height: 30px;
                        }
                        .ico_user{
                            display: block;
                            padding: 15px 20px;
                            background: url(./assets/images/ico_user.png) center no-repeat;
                            background-size: auto 80%;
                        }
                    }
                    .sub{
                        position: absolute;
                        right: 0;
                        top: 42px;
                        width: 100px;
                        padding: 10px 15px;
                        background: #fff;
                        border: 1px solid #2e2efe;
                        &::before,&::after{
                            content: '';
                            position: absolute;
                            top: -20px;
                            right: 10px;
                            width: 0;
                            height: 0;
                            border: 10px solid;
                            border-color: transparent transparent #2e2efe;
                        }
                        &::after{
                            top: -18px;
                            border: 10px solid;
                            border-color: transparent transparent #fff;
                        }
                        .item{
                            line-height: 30px;
                        }
                    }
                    .router-link-exact-active{
                        color: #2e2efe;
                    }
                }
            }
        }  
    }
       
}
footer{
    width: 100%;
    padding: 20px 0;
    border-top: 1px solid #e6e6e6;
    .con{
        margin: 0 auto;
        width: 94%;
        max-width: 1200px;
        .links{
            margin: 30px 0;
            a{
                display: inline-block;
                font-size: 16px;
                font-family: 'NotoSansKR-Medium';
                padding: 0 10px;
                // border-right: 1px solid #adadad;
                &:first-child{
                    padding-left: 0;
                }
                &:hover{
                    color: #2e2efe;
                }
            }
        }
        p{
            line-height: 26px;
            &.mtb{
                margin: 20px 0;
            }
            &.cpy{
                font-size: 12px;
            }
            span{
                color: #adadad;
            }
            a{
                color: #2e2efe;
            }
        }
    }
}
.el-form-item__success{
    color: #67c23a;
    font-size: 12px;
    line-height: 1;
    padding-top: 4px;
    position: absolute;
    top: 100%;
    left: 0;
}
.v-modal{
    opacity: .8 !important;
}
.el-month-table{
    font-size: 14px !important;
}
.layoutCon{
    // width: 90%;
    width: 1200px;
    min-height: 30vh;
    margin: 20px auto 0 auto;
}
.breadcrumb{
    line-height: 20px;
    margin-bottom: 25px;
    position: relative;
    .home{
        padding: 0 12px;
        background: url(./assets/images/ico_home.png) left center no-repeat;
        background-size: auto 16px;
    }
    a:hover{
        color: #2e2efe;
    }
    .btn{
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        box-sizing: border-box;
        width: 150px;
        line-height: 38px;
        padding: 0;
        border-radius: 0;
        font-size: 16px;
        color: #2e2efe;
        border-color: #2e2efe;
    }
}
.loadMore{
    text-align: center;
    position: relative;
    margin: 30px 0 100px 0;
    a{
        display: inline-block;
        width: 150px;
        line-height: 40px;
    }
    .btnMore{
        color: #fff;
        background: #2e2efe;
        border-radius: 10px;
        width: 150px;
    }
    .btnSend{
        position: absolute;
        top: 0;
        right: 0;
        width: 150px;
        border-radius: 0;
        color: #2e2efe;
        border-color: #2e2efe;
    }
}
.pageHead{
    .top{
        font-size: 0;
        box-sizing: border-box;
        padding: 0 40px 0 0;
        position: relative;
        text-align: right;
        .info{
            text-align: left;
            position: absolute;
            left: 0;
            top: 45%;
            transform: translateY(-50%);
            letter-spacing: -2px;
            strong{
                font-size: 28px;
                font-family: 'NotoSansKR-Bold';
                line-height: 60px;
                color: #2e2efe;
                display: block;
            }
            p{
                font-size: 46px;
                font-family: 'HGGGothicssi-40g';
                line-height: 50px;
                b{
                    display: block;
                    font-family: 'HGGGothicssi-20g';
                    color: #2e2efe;
                }
            }
        }
        .pic{
            height: 260px;
        }
    }

    .tab{
        margin: 0 0 60px 0;
        display: flex;
        justify-content: space-between;
        border: 1px solid #2e2efe;
        a{
            width: 33.433%;
            box-sizing: border-box;
            padding: 20px 50px;
            font-size: 22px;
            font-family: 'NotoSansKR-Bold';
            letter-spacing: -1px;
            color: #2e2efe;
            &:nth-child(2){
                border-left: 1px solid #2e2efe;
                border-right: 1px solid #2e2efe;
            }
            &.active{
                color: #fff;
                background: #2e2efe;
            }
        }
    }
}
.mainSearch{
    .serBox{
        height: 60px;
        position: relative;
        &.open2{
            .keyword{
                border-right-color: #2e2efe;
                border-bottom-color: #2e2efe;
            }
            .area{
                border-top-color: #2e2efe;
                border-bottom-color: #e2e2e2;
            }
            .category{
                border-left-color: #2e2efe;
                border-bottom-color: #2e2efe;
            }     
        }
        &.open3{
            .keyword,.area{
                border-bottom-color: #2e2efe;
            }
            .category{
                border-top-color: #2e2efe;
                border-left-color: #2e2efe;
                border-bottom-color: #e2e2e2;
            }     
        }
        .option{
            float: left;
            width: 343px;
            height: 60px;
            box-sizing: border-box;
            padding: 15px 20px 15px 60px;
            position: relative;
            border: 1px solid #000;
            &::before{
                content: '';
                position: absolute;
                top: 50%;
                left: 20px;
                transform: translateY(-50%);
                width: 40px;
                height: 30px;
                background-position: left center;
                background-repeat: no-repeat;
                background-image: url(./assets/images/ico_search.png);
                background-size: 25px auto;
            }
            &.area{
                cursor: pointer;
                border-left: 0;
                border-right: 0;
                &::before{
                    background-image: url(./assets/images/ico_address.png);
                    background-size: 21px auto;
                }
            }
            &.category{
                cursor: pointer;
                border-right: 0em;
                padding-left: 70px;
                &::before{
                    background-image: url(./assets/images/ico_card.png);
                    background-size: 32px auto;
                }
            }
            .el-icon-circle-close{
                position: absolute;
                top: 50%;
                right: 8px;
                transform: translateY(-50%);
                font-size: 16px;
                color: #000;
            }
            .inner{
                position: relative;
                .placeholder{
                    cursor: pointer;
                    position: absolute;
                    width: 100%;
                    line-height: 30px;
                    color: #929292;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    small{
                        font-size: 12px;
                    }
                }
                .filter{
                    position: absolute;
                    width: 100%;
                    line-height: 30px;
                    color: #2e2efe;
                    overflow: hidden;
                    text-overflow:ellipsis;    
                    white-space: nowrap;                    
                }
                .kws{
                    position: absolute;
                    border: 0;
                    width: 100%;
                    height: 30px;
                    left: 0;
                    top: 0;
                    outline: 0;
                }
            }            
        }
        .btnSer{
            float: right;
            width: 171px;
            .el-button{
                font-size: 18px;
                width: 100%;
                padding: 20px 0;
                border-radius: 0;
            }
        }
        .panel{
            box-sizing: border-box;
            position: absolute;
            z-index: 2;
            left: 0;
            top: 60px;
            width: 100%;
            min-height: 180px;
            background: #fff;
            border: 1px solid #2e2efe;
            border-top: 0;
        }
    }
    .other{
        user-select: none;
        border: 1px solid #e2e2e2;
        .tit,.searClose{
            cursor: pointer;
            font-size: 18px;
            font-family: 'NotoSansKR-Medium';
            line-height: 60px;
            padding: 0 20px;
            background: #f9f9f9;
            position: relative;
            &.open{
                .arrow{
                    transform: translateY(-50%) rotate(-180deg);
                }
            }
            .arrow{                
                position: absolute;
                right: 20px;
                top: 50%;
                transform: translateY(-50%);
                width: 30px;
                height: 30px;
                background: url(./assets/images/ico_arrow_down.png) center no-repeat;
                background-size: 98% auto;
                transition: all .3s;
            }
        }
        .list{
            background: #fff;
            border-top: 1px solid #e2e2e2;
            ul{
                li{
                    box-sizing: border-box;
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    padding: 0 30px;
                    border-bottom: 1px solid #e2e2e2;
                    span{
                        display: block;
                        padding: 0 10px;
                        line-height: 60px;
                        font-size: 16px;
                        font-family: 'NotoSansKR-Bold';
                    }
                    .ops{
                        width: 88%;
                        margin-bottom: 20px;
                        .chx{
                            width: 16%;
                            margin-right: 1.5%;
                            line-height: 20px;
                            margin-top: 20px;
                            &:nth-child(5n){
                                margin-right: 0;
                            }                     
                        }
                    }
                }
            }
        }
    }
}
.chx{
    display: inline-block;
    position: relative;
    line-height: 60px;
    padding: 0 0 0 28px;
    cursor: pointer;
    input{
        position: absolute;
        opacity: 0;
        width: 1px;
        height: 1px;
    }
    i{
        content: '';
        box-sizing: border-box;
        width: 18px;
        height: 18px;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        background: url(./assets/images/ico_check_o.png) center no-repeat;
        background-size: 100% auto;
    }
    input:checked + i{
        background: url(./assets/images/ico_check.png) center no-repeat;
        background-size: 100% auto;
    }
}
.fileInp{
    position: relative;
    .file{
        position: absolute;
        z-index: 3;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
    }
}
.dialogCard{
    .el-dialog{
        width: 740px;
        border-radius: 0;
        .el-dialog__headerbtn{
            top: 0;
            right: -40px;
            width: 30px;
            height: 30px;
            background: url(./assets/images/ico_close.png) center no-repeat;
            background-size: auto 100%;            
            .el-dialog__close{
                display: none;
            }            
        }
        .el-dialog__body{
            padding: 10px 40px 60px 40px;
        }
    }    
}
.dialogMini{
    .el-dialog{
        width: 460px;
        border-radius: 0;
        margin-top: 30vh !important;
        .el-dialog__header{
            padding: 0 30px;
            background: #2e2efe;
            .el-dialog__title{
                color: #fff;
                font-size: 20px;
                line-height: 55px;
            }
        }
        .el-dialog__headerbtn{
            top: 15px;
            right: 15px;
            width: 25px;
            height: 25px;
            background: url(./assets/images/ico_close.png) center no-repeat;
            background-size: auto 100%;            
            .el-dialog__close{
                display: none;
            }            
        }
        .el-dialog__body{
            padding: 20px 40px 0 40px;
            .con{
                text-align: center;
                font-size: 18px;
                line-height: 24px;
                color: #000;
                padding: 30px 0;
            }
        }
        .el-dialog__footer{
            padding: 10px 20px 40px 20px;
            .miniFooter{
                text-align: center;
                .el-button{
                    width: 188px;
                    padding: 16px 20px;
                    border-radius: 0;
                    &.esc{
                        color: #2e2efe;
                        border-color: #2e2efe;
                    }
                }
            }
        }
    }
    &.dialogEdit{
        .el-dialog{
            margin-top: 15vh !important;
        }
        .el-dialog__body{
            padding: 20px;
        }
        .el-dialog__footer{
            padding: 10px 20px 20px 20px;
        }
        .editBox{
            position: relative;
            width: 100%;
            height: 400px;
            border: 1px solid #eee;
            .tips{
                position: absolute;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                cursor: pointer;
                width: 100%;
                text-align: center;
                .file{
                    opacity: 0;
                    position: absolute;
                    z-index: 2;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    cursor: pointer;               
                }
                .btnAdd{
                    span{
                        margin: 0;
                    }
                    margin-bottom: 10px;  
                }
            }
            .btnDel{
                position: absolute;
                bottom: 10px;
                right: 10px;
            }
        }
    }
}
.dialogIndexBox{
    .el-dialog{
        width: 500px;
        border-radius: 0;
        margin: 0 !important;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        .el-dialog__header{
            display: none;
        }
        .el-dialog__body{
            padding: 0;
            // .swp{
            //     position: relative;
            //     .ctls{
            //         left: auto;
            //         right: 3%;
            //         .btn{
            //             background-size: auto 90%;
            //         }
            //     }
            // }
            .box{
                width: 100%;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
            }
            .pic{
                background: #fff;
                min-height: 100px;
                a{
                    display: block;
                    height: 100%;
                }
                img{
                    display: block;
                    width: 100%;
                }
            }
            .btns{
                border-top: 1px solid #2e2efe;
                display: flex;
                justify-content: space-between;
                .el-button{
                    width: 50%;
                    line-height: 22px;
                    border-radius: 0;
                    border: 0;
                    letter-spacing: .4px;
                    font-size: 18px;
                    font-family: 'NotoSansKR-Medium';
                    color: #2e2efe;
                }
                .el-button + .el-button{
                    margin-left: 0;
                    border-left: 1px solid #2e2efe;
                }
            }
        }
    }
}
.dialogDaum{
    .el-dialog{
        width: 460px;
        border-radius: 0;
        margin: 0 !important;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        .el-dialog__header{
            height: 40px;
            padding: 0;
            .el-dialog__headerbtn{
                top: 10px;
                right: 15px;
            }
        }
        .el-dialog__body{
            padding: 0;
        }
        .el-dialog__footer{
            padding: 10px;
        }
    }
}
.dialogRule{
    .el-dialog{
        .el-dialog__header h3{
           height: 20px;
        }
    }
}
.notSerData{
    padding: 180px 0;
    text-align: center;
    font-size: 18px;
    line-height: 30px;
    strong{
        font-size: 22px;
        font-family: 'NotoSansKR-Medium';
        color: #2e2efe;
    }
    img{
        display: block;
        margin: 20px auto;
    }
}
.notData{
    padding: 60px 0;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 20px;
}
.otherPage{
    min-height: 60vh;
}
.imp-dialog{
    background: rgba(0,0,0,0.8) !important;
}
.el-image-viewer__mask{
    opacity: .8 !important;
}
.el-image-viewer__close{
    color: #fff !important;
}
.el-message-box{
    border-radius: 0 !important;
    .el-button{
        border-radius: 0 !important;    
    }
}
.el-loading-mask{
    z-index: 3 !important;
}
.el-popconfirm__main{
    margin-bottom: 5px !important;
}
.el-image-viewer__canvas{
    display: block !important;
}
.el-image__inner--center{
    top: auto !important;
    left: auto !important;
    transform: none !important;
}
.card .box .con img,.infoBox .con img,.card .con img{
    max-width: 100% !important;
}
.card .con{
    .user_content,.pc_recruit_template,.user_content table,.pc_recruit_template .wrap_tbl_template, .pc_recruit_template .wrap_list_template{
        width: 100% !important;
    }
}
.otherPage{
    .el-tabs__item{
        font-size: 18px;
        text-align: center;
    }
    .con{
        padding: 0 0 50px 0;
        p,span{
            // font-size: 14px !important;
            // font-family: 'NotoSansKR-Regular' !important;
            // line-height: 24px !important;
        }
        table{
            width: 100% !important;
            border: 1px solid #eee !important;
            margin-left: 0 !important;
            td{
                border: 1px solid #eee !important;
                padding-left: 10px !important;
                padding-right: 10px !important;
                p{
                    margin: 0 !important;
                }
            }
        }
    }
}
.note-editor .note-editing-area .note-editable,.card .box .con .info,.infoBox .con .des,.card .richCon{
    ul,ol{
        margin: 1em 0;
        padding: 0 0 0 40px;
        // margin-block-start: 1em;
        // margin-block-end: 1em;
        // padding-inline-start: 40px;
    }
    ul,ul li{
        list-style-type: disc;
    }
    ol,ol li{
        list-style-type: decimal;
    }
    strong, b{
        font-weight: bold;
    }
    table{
        width: 100%;
        td,th{
            border: 1px solid #ececec;
            padding: 5px 3px;
        }
    }
}
.myCascader,.myCascader2{
    .el-cascader-node > .el-radio{
        position: absolute;
        left: 0;
        top: 0;
        width: 80%;
        height: 100%;
        opacity: 0;
    }    
}
.myCascader{
    .el-cascader-panel .el-cascader-menu:nth-child(1){
        .el-cascader-node > .el-radio{display: none;}
    }
}
@media (max-width: 1900px){
    body{
        padding-top: 100px;
    }
    header{
        padding: 25px 50px;
        height: 100px;
        .logo{ 
            margin-right: 80px;     
            img{
                height: 50px;
            }
        }
        ul li{
            dl{
                top: 55px;
                padding: 15px 20px;
                dd a{
                    font-size: 16px;
                    line-height: 35px;
                }
                &::after{
                    height: 6px;
                    left: 50%;
                    top: -6px;
                }
            }
        }
        .nav{
            li{
                margin-right: 90px;
                a.m{
                    line-height: 50px;
                    font-size: 24px;
                }                
            }
        }
        .fr{
            padding: 10px 0;
            ul{
                li{
                    float: left;
                    line-height: 30px;
                    .ico_service,.ico_user{
                        display: block;
                        padding: 14px 30px;
                    }
                    &.line{
                        width: 20px;
                        height: 30px;
                    }
                    .btn{
                        padding: 0 20px;
                    }
                    dl{
                        top: 38px;
                    }
                }
            }
        }
    }    
}
@media (max-width: 1440px){
    body{
        padding-top: 90px;
    }
    header{
        padding: 25px 40px;
        height: 90px;
        .logo{ 
            margin-right: 60px;     
            img{
                height: 40px;
            }
        }
        ul li{
            dl{
                top: 40px;
                padding: 10px 15px;
                dd a{
                    font-size: 16px;
                    line-height: 30px;
                }
                &::after{
                    height: 4px;
                    left: 50%;
                    top: -4px;
                }
            }
        }
        .nav{
            li{
                margin-right: 70px;
                a.m{
                    line-height: 40px;
                    font-size: 18px;
                }                
            }
        }
        .fr{
            padding: 5px 0;
            ul{
                li{
                    line-height: 30px;
                    .ico_service,.ico_user{
                        padding: 14px 25px;
                    }
                    &.line{
                        height: 24px;
                    }
                    .btn{
                        padding: 0 20px;
                    }
                    dl{
                        top: 35px;
                    }
                }
            }
        }
    }
    .pageHead{
        .top{
            .info{
                top: 40%;
                strong{
                    font-size: 24px;
                    line-height: 50px;
                }
                p{
                    font-size: 42px;
                }
            }
            .pic{
                height: 240px;
            }
        }    
        .tab{
            margin: 0 0 40px 0;
            a{
                padding: 15px 40px;
                font-size: 18px;
            }
        }
    }
    .layoutCon{
        max-width: 1100px;
    }
    .mainSearch{
        .serBox{
            height: 50px;
            .option{
                width: 28%;
                height: 50px;
                padding: 10px 20px 10px 50px;
                &::before{
                    background-size: 22px auto;
                }
                &.area{
                    &::before{
                        background-size: 18px auto;
                    }
                }
                &.category{
                    &::before{
                        background-size: 30px auto;
                    }
                }
                .inner{
                    .placeholder{
                        line-height: 30px;
                    }
                    .filter{
                        line-height: 30px;                   
                    }
                }            
            }
            .btnSer{
                width: 16%;
                .el-button{
                    font-size: 16px;
                    padding: 16px 0;
                }
            }
            .panel{
                top: 50px;
                min-height: 160px;
            }
        }
        .other{
            .tit,.searClose{
                cursor: pointer;
                font-size: 16px;
                line-height: 50px;
                padding: 0 20px;
                .arrow{                
                    background-size: 88% auto;
                }
            }
            .list{
                ul{
                    li{
                        padding: 0 20px;
                        span{
                            padding: 0 10px;
                            line-height: 50px;
                            font-size: 16px;
                        }
                        .ops{
                            width: 89%;
                            .chx{
                                width: 20%;
                                margin-right: 2%;
                                &:nth-child(5n){
                                    margin-right: 2%;
                                } 
                                &:nth-child(4n){
                                    margin-right: 0;
                                }                  
                            }
                        }
                    }
                }
            }
        }
    }
    .notSerData{
        padding: 140px 0;
        img{
            width: 140px;
        }
    }
}
@media (max-width: 1200px){
    body{
        padding-top: 80px;
    }
    header{
        padding: 25px 30px;
        height: 80px;
        .logo{ 
            margin-right: 40px;     
            img{
                height: 30px;
            }
        }
        ul li{
            dl{
                top: 30px;
                padding: 10px 15px;
                dd a{
                    font-size: 14px;
                    line-height: 30px;
                }
                &::after{
                    height: 4px;
                    left: 50%;
                    top: -4px;
                }
            }
        }
        .nav{
            li{
                margin-right: 50px;
                a.m{
                    line-height: 30px;
                    font-size: 16px;
                }                
            }
        }
        .fr{
            padding: 0;
            ul{
                li{
                    line-height: 30px;
                    .ico_service,.ico_user{
                        padding: 13px 25px;
                    }
                    &.line{
                        height: 24px;
                        margin-top: 3px;
                    }
                    .btn{
                        padding: 0 20px;
                    }
                    dl{
                        top: 35px;
                    }
                }
            }
        }
    }
    .layoutCon{
        width: 92%;
        margin: 10px auto;
    }
    .pageHead{
        .top{
            .info{
                top: 40%;
                strong{
                    font-size: 18px;
                    line-height: 30px;
                }
                p{
                    font-size: 32px;
                    line-height: 40px;
                }
            }
            .pic{
                height: 200px;
            }
        }    
        .tab{
            margin: 0 0 30px 0;
            a{
                padding: 15px;
                font-size: 16px;
            }
        }
    }
    .mainSearch{
        .serBox{
            height: 50px;
            .option{
                width: 28%;
                height: 50px;
                padding: 10px 20px 10px 50px;
                &::before{
                    background-size: 22px auto;
                }
                &.area{
                    &::before{
                        background-size: 18px auto;
                    }
                }
                &.category{
                    &::before{
                        background-size: 30px auto;
                    }
                }
                .inner{
                    .placeholder{
                        line-height: 30px;
                    }
                    .filter{
                        line-height: 30px;                   
                    }
                }            
            }
            .btnSer{
                width: 16%;
                .el-button{
                    font-size: 16px;
                    padding: 16px 0;
                }
            }
            .panel{
                top: 50px;
                min-height: 160px;
            }
        }
        .other{
            .tit,.searClose{
                cursor: pointer;
                font-size: 16px;
                line-height: 50px;
                padding: 0 20px;
                .arrow{                
                    background-size: 88% auto;
                }
            }
            .list{
                ul{
                    li{
                        padding: 0 20px;
                        span{
                            padding: 0 10px;
                            line-height: 50px;
                            font-size: 16px;
                        }
                        .ops{
                            width: 89%;
                            margin-bottom: 15px;
                            .chx{
                                margin-top: 15px;  
                                width: 20%;
                                margin-right: 2%;
                                &:nth-child(5n){
                                    margin-right: 2%;
                                } 
                                &:nth-child(4n){
                                    margin-right: 0;
                                }                     
                            }
                        }
                    }
                }
            }
        }
    }
    .notSerData{
        padding: 80px 0;
        text-align: center;
        font-size: 12px;
        line-height: 30px;
        strong{
            font-size: 16px;
        }
        img{
            width: 120px;
        }
    }
}
@media (max-width: 768px){ 
    body{
        padding-top:60px;
    }
    header{
        padding: 15px;
        height: 60px;
        background: #fff;
        border-bottom: 1px solid #e6e6e6;
        .logo{ 
            margin: 0;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);   
            img{
                height: 30px;
            }
        }
        .nav{
            display: none;
        }
        .fr{
            display: none;
            padding: 0;
            ul{
                li{
                    line-height: 30px;
                    .ico_service,.ico_user{
                        padding: 15px 20px;
                        background-size: auto 80%;
                    }
                    &.line{
                        height: 24px;
                        margin-top: 3px;
                        display: none;
                    }
                    &.wapNo{
                        display: none;
                    }
                    .btn{
                        padding: 0 6px;
                    }
                    dl{
                        top: 35px;
                    }
                }
            }
        }
        .wap{
            display: block;
        }
    }
    footer{
        padding: 10px 0;
        .con{
            text-align: center;
            .links{
                margin: 10px 0;
                a{
                    font-size: 12px;
                    padding: 0;
                }
            }
            p{
                line-height: 24px;
                &.mtb{
                    margin: 15px 0;
                }
                &.cpy{
                    font-size: 12px;
                }
                span{
                    color: #adadad;
                }
                a{
                    color: #2e2efe;
                }
            }
        }
    }
    .breadcrumb{
        margin-bottom: 20px;
        .btn {
            width: 120px;
            line-height: 30px;
            font-size: 14px;
        }
    }
    .dialogCard{
        .el-dialog{
            width: 90%;
            .el-dialog__headerbtn{
                top: 0;
                right: 0;
                width: 30px;
                height: 30px;
                background: url(./assets/images/ico_close2.png) center no-repeat;
                background-size: auto 50%;          
            }
            .el-dialog__body{
                padding: 0 15px 20px 15px;
            }
        }    
    }
    .dialogMini{
        .el-dialog{
            width: 90%;
            .el-dialog__header{
                padding: 0 20px;
                .el-dialog__title{
                    font-size: 18px;
                    line-height: 40px;
                }
            }
            .el-dialog__headerbtn{
                top: 15px;
                right: 15px;
                width: 15px;
                height: 15px;      
            }
            .el-dialog__body{
                padding: 20px 20px 0 20px;
                .con{
                    font-size: 14px;
                    padding: 20px 0;
                }
            }
            .el-dialog__footer{
                padding: 10px 20px 30px 20px;
                .miniFooter{
                    .el-button{
                        width: 116px;
                        padding: 12px 20px;
                    }
                }
            }
        }
    }
    .pageHead{
        .top{
            padding: 50px 0 30px 0;
            .info{
                position: relative;
                transform: none;
                strong{
                    font-size: 16px;
                    line-height: 24px;
                    display: inline-block;
                    padding-right: 10px;
                }
                p{
                    display: inline-block;
                    font-size: 16px;
                    line-height: 24px;
                    b{
                        display: inline-block;
                        padding-left: 10px;
                    }
                }
            }
            .pic{
                width: 96%;
                height: auto;
                display: block;
                margin: 0 auto;
            }
        }    
        .tab{
            position: fixed;
            z-index: 98;
            top: 60px;
            left: 0;
            right: 0;
            margin: 0;
            background: #fff;
            a{
                padding: 10px;
                font-size: 14px;
            }
        }
    }
    .dialogIndexBox{
        .el-dialog{
            width: 90%;
            .el-dialog__body{
                .pic{
                    min-height: 80px;
                }
                .btns{
                    .el-button{
                        font-size: 14px;
                    }
                }
            }
        }
    }
    .el-message-box{
        width: 90% !important;
    }
    .mainSearch{
        .serBox{
            height: auto;
            .option{
                float: none;
                width: 100%;
                height: 40px;
                padding: 5px 20px 5px 40px;
                border: 1px solid #000 !important;
                margin-bottom: 10px;
                &::before{
                    left: 12px;
                    background-size: 20px auto;
                }
                &.area{
                    &::before{
                        background-size: 16px auto;
                    }
                }
                &.category{
                    padding-left: 40px;
                    &::before{
                        left: 10px;
                        background-size: 22px auto;
                    }
                }
                .inner{
                    .placeholder{
                        line-height: 30px;
                    }
                    .filter{
                        line-height: 30px;                   
                    }
                }            
            }
            .btnSer{
                float: none;
                width: 100%;
                .el-button{
                    font-size: 16px;
                    padding: 12px 0;
                }
            }
            .panel{
                top: 89px;
                min-height: 160px;
                // .el-cascader-menu{
                //     min-width: 80px;
                // }
                // .el-cascader-node{
                //     padding: 0 15px 0 0;
                //     font-size: 12px;
                // }
            }
            &.open3{
                .panel{
                    top: 139px;
                }
            }
        }
        .other{
            margin-top: 20px;
            .tit,.searClose{
                cursor: pointer;
                font-size: 16px;
                line-height: 50px;
                padding: 0 20px;
                .arrow{                
                    background-size: 80% auto;
                }
            }
            .list{
                ul{
                    li{
                        display: block;
                        padding: 0;
                        span{
                            padding: 0 20px;
                            line-height: 40px;
                            font-size: 14px;
                            display: block;
                            border-bottom: 1px solid #eee;
                        }
                        .ops{
                            width: 100%;
                            padding: 0 20px;
                            box-sizing: border-box;
                            .chx{  
                                display: inline-block;
                                font-size: 12px;
                                padding-left: 20px;
                                i{
                                    width: 15px;
                                    height: 15px;
                                }     
                                width: 42.5%;
                                margin-right: 0;
                                &:nth-child(5n){
                                    margin-right: 0;
                                } 
                                &:nth-child(4n){
                                    margin-right: 0;
                                }        
                            }
                        }
                    }
                }
            }
        }
    }
    .notSerData{
        padding: 80px 0;
        text-align: center;
        font-size: 12px;
        line-height: 24px;
        strong{
            font-size: 18px;
        }
        img{
            width: 80px;
        }
    }
    .el-image-viewer__img{
        max-width: 94% !important;
    }
    .el-image-viewer__close{
        top: 10px !important;
        right: 10px !important;
        font-size: 30px !important;
    }
    .el-cascader-menu{
        min-width: 100px !important;
    }
    .el-cascader-node{
        padding: 0 15px 0 0 !important;
        font-size: 12px !important;
    }
    .el-date-range-picker{
        left: 30px !important;
        width: 86% !important;
        .el-picker-panel__body{
            width: 100% !important;
            min-width: auto !important;
            .el-date-range-picker__content{
                padding: 10px !important;
                float: none !important;
                width: 100% !important;
                .el-date-table td{
                    padding: 2px 0 !important;
                }
                .el-picker-panel__icon-btn{
                    padding: 0 10px;
                }
            }
        }
    }
    .otherPage{
        .el-tabs__item{
            font-size: 14px;
        }
    }
    .dialogDaum{
        .el-dialog{
            width: 90%;
        }
    }
}

// @media (max-width: 1440px){

// }
// @media (max-width: 1200px){

// }

// @media (max-width: 768px){ 

// }